{% load static %}
<!doctype html>
<html lang="zh">

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <title>小柿子专属考试刷题系统</title>
    <link rel="stylesheet" href="{% static 'css/backend-plugin.min.css' %}">
    <link rel="stylesheet" href="{% static 'css/backend.css' %}">
    <link rel="stylesheet" href="{% static 'css/all.min.css' %}">
    <link rel="stylesheet" href="{% static 'css/line-awesome.min.css' %}">
    <link rel="stylesheet" href="{% static 'css/remixicon.css' %}">
</head>

<body class="  ">
    <div id="loading">
        <div id="loading-center"></div>
    </div>
    <div class="wrapper">
        <div class="iq-sidebar  sidebar-default ">
            <div class="iq-sidebar-logo d-flex align-items-center justify-content-between">
                <h5 class="logo-title light-logo ml-3">刷题系统</h5>
                <div class="iq-menu-bt-sidebar ml-0"><i class="las la-bars wrapper-menu"></i></div>
            </div>
            <div class="data-scrollbar" data-scroll="1">
                <nav class="iq-sidebar-menu">
                    <ul id="iq-sidebar-toggle" class="iq-menu">
                        <li class="active">
                            <a href="{% url 'nurse:home' %}" class="svg-icon">
                                <svg class="svg-icon" id="p-dash1" width="20" height="20"
                                    xmlns="http://www.w3.org/2000/svg" viewbox="0 0 24 24" fill="none"
                                    stroke="currentColor" stroke-width="2" stroke-linecap="round"
                                    stroke-linejoin="round">
                                    <path
                                        d="M21 16V8a2 2 0 0 0-1-1.73l-7-4a2 2 0 0 0-2 0l-7 4A2 2 0 0 0 3 8v8a2 2 0 0 0 1 1.73l7 4a2 2 0 0 0 2 0l7-4A2 2 0 0 0 21 16z">
                                    </path>
                                    <polyline points="3.27 6.96 12 12.01 20.73 6.96"></polyline>
                                    <line x1="12" y1="22.08" x2="12" y2="12"></line>
                                </svg>
                                <span class="ml-4">数据预览</span>
                            </a>
                        </li>
                        <li class=" "><a href="#category" class="collapsed" data-toggle="collapse"
                                aria-expanded="false">
                                <svg class="svg-icon" id="p-dash3" width="20" height="20"
                                    xmlns="http://www.w3.org/2000/svg" viewbox="0 0 24 24" fill="none"
                                    stroke="currentColor" stroke-width="2" stroke-linecap="round"
                                    stroke-linejoin="round">
                                    <rect x="9" y="9" width="13" height="13" rx="2" ry="2"></rect>
                                    <path d="M5 15H4a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h9a2 2 0 0 1 2 2v1"></path>
                                </svg>
                                <span class="ml-4">题目管理</span>
                                <svg class="svg-icon iq-arrow-right arrow-active" width="20" height="20"
                                    xmlns="http://www.w3.org/2000/svg" viewbox="0 0 24 24" fill="none"
                                    stroke="currentColor" stroke-width="2" stroke-linecap="round"
                                    stroke-linejoin="round">
                                    <polyline points="10 15 15 20 20 15"></polyline>
                                    <path d="M4 4h7a4 4 0 0 1 4 4v12"></path>
                                </svg>
                            </a>
                            <ul id="category" class="iq-submenu collapse" data-parent="#iq-sidebar-toggle">
                                {% if nurse.authority %}
                                <li class="">
                                    <a href="{% url 'exercise:upload' %}">
                                        <i class="las la-minus"></i>
                                        <span>导入题库</span>
                                    </a>
                                </li>
                                {% endif %}
                                <li class="">
                                    <a href="{% url 'exercise:add' %}">
                                        <i class="las la-minus"></i>
                                        <span>添加题目</span>
                                    </a>
                                </li>
                                <li class="">
                                    <a href="{% url 'exercise:show_exercise' %}">
                                        <i class="las la-minus"></i>
                                        <span>查看题库</span>
                                    </a>
                                </li>
                                <li class="">
                                    <a href="{% url 'exercise:show_collection' %}">
                                        <i class="las la-minus"></i>
                                        <span>我的收藏题</span>
                                    </a>
                                </li>
                            </ul>
                        </li>
                        <li class=" "><a href="#purchase" class="collapsed" data-toggle="collapse"
                                aria-expanded="false">
                                <svg class="svg-icon" id="p-dash5" width="20" height="20"
                                    xmlns="http://www.w3.org/2000/svg" viewbox="0 0 24 24" fill="none"
                                    stroke="currentColor" stroke-width="2" stroke-linecap="round"
                                    stroke-linejoin="round">
                                    <rect x="1" y="4" width="22" height="16" rx="2" ry="2"></rect>
                                    <line x1="1" y1="10" x2="23" y2="10"></line>
                                </svg>
                                <span class="ml-4">在线刷题</span>
                                <svg class="svg-icon iq-arrow-right arrow-active" width="20" height="20"
                                    xmlns="http://www.w3.org/2000/svg" viewbox="0 0 24 24" fill="none"
                                    stroke="currentColor" stroke-width="2" stroke-linecap="round"
                                    stroke-linejoin="round">
                                    <polyline points="10 15 15 20 20 15"></polyline>
                                    <path d="M4 4h7a4 4 0 0 1 4 4v12"></path>
                                </svg>
                            </a>
                            <ul id="purchase" class="iq-submenu collapse" data-parent="#iq-sidebar-toggle">
                                <li class="">
                                    <a href="{% url 'exercise:do_exercise' %}?operate=random">
                                        <i class="las la-minus"></i>
                                        <span>随机刷题</span>
                                    </a>
                                </li>
                                <li class="">
                                    <a href="#">
                                        <i class="las la-minus"></i>
                                        <span>按章刷题</span>
                                    </a>
                                </li>
                            </ul>
                        </li>
                        <li class=""><a href="#" class="">
                                <svg class="svg-icon" id="p-dash7" width="20" height="20"
                                    xmlns="http://www.w3.org/2000/svg" viewbox="0 0 24 24" fill="none"
                                    stroke="currentColor" stroke-width="2" stroke-linecap="round"
                                    stroke-linejoin="round">
                                    <path d="M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z"></path>
                                    <polyline points="14 2 14 8 20 8"></polyline>
                                    <line x1="16" y1="13" x2="8" y2="13"></line>
                                    <line x1="16" y1="17" x2="8" y2="17"></line>
                                    <polyline points="10 9 9 9 8 9"></polyline>
                                </svg>
                                <span class="ml-4">模拟考试</span></a>
                            <ul id="reports" class="iq-submenu collapse" data-parent="#iq-sidebar-toggle"></ul>
                        </li>
                    </ul>
                </nav>
                <div id="sidebar-bottom" class="position-relative sidebar-bottom">
                    <div class="card border-none">
                        <div class="card-body p-0">
                            <div class="sidebarbottom-content">
                                <div class="image"><img src="{% static 'picture/side-bkg.png' %}" class="img-fluid"
                                        alt="side-bkg">
                                </div>
                                <button type="button" class="btn sidebar-bottom-btn mt-4">成为VIP</button>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="p-3"></div>
            </div>
        </div>
        <div class="iq-top-navbar">
            <div class="iq-navbar-custom">
                <nav class="navbar navbar-expand-lg navbar-light p-0">
                    <div class="iq-navbar-logo d-flex align-items-center justify-content-between">
                        <i class="ri-menu-line wrapper-menu"></i>
                        <a href="{% url 'nurse:home' %}" class="header-logo">
                            <img src="{% static 'picture/logo.png' %}" class="img-fluid rounded-normal" alt="logo">
                            <h5 class="logo-title ml-3">护士护师刷题系统</h5>
                        </a>
                    </div>
                    <div class="d-flex align-items-center">
                        <button class="navbar-toggler" type="button" data-toggle="collapse"
                            data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent"
                            aria-label="Toggle navigation"><i class="ri-menu-3-line"></i></button>
                        <div class="collapse navbar-collapse" id="navbarSupportedContent">
                            <ul class="navbar-nav ml-auto navbar-list align-items-center">
                                <li class="nav-item nav-icon dropdown">
                                    <a href="#" class="search-toggle dropdown-toggle" id="dropdownMenuButton"
                                        data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                                        <svg xmlns="http://www.w3.org/2000/svg" width="20" height="20"
                                            viewbox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"
                                            stroke-linecap="round" stroke-linejoin="round" class="feather feather-bell">
                                            <path d="M18 8A6 6 0 0 0 6 8c0 7-3 9-3 9h18s-3-2-3-9"></path>
                                            <path d="M13.73 21a2 2 0 0 1-3.46 0"></path>
                                        </svg>
                                        <span class="bg-primary "></span>
                                    </a>
                                    <div class="iq-sub-dropdown dropdown-menu" aria-labelledby="dropdownMenuButton">
                                        <div class="card shadow-none m-0">
                                            <div class="card-body p-0 ">
                                                <div class="cust-title p-3">
                                                    <div class="d-flex align-items-center justify-content-between">
                                                        <h5 class="mb-0">通知</h5>
                                                        <a class="badge badge-primary badge-card" href="#">1</a>
                                                    </div>
                                                </div>
                                                <div class="px-3 pt-0 pb-0 sub-card">
                                                    <a href="#" class="iq-sub-card">
                                                        <div
                                                            class="media align-items-center cust-card py-3 border-bottom">
                                                            <div class="media-body ml-3">
                                                                <div
                                                                    class="d-flex align-items-center justify-content-between">
                                                                    <h6 class="mb-0">今日第一次刷题</h6>
                                                                    <small class="text-dark"><b>12:47 pm</b></small>
                                                                </div>
                                                            </div>
                                                        </div>
                                                    </a>
                                                </div>
                                                <a class="right-ic btn btn-primary btn-block position-relative p-2"
                                                    href="#" role="button">查看全部</a>
                                            </div>
                                        </div>
                                    </div>
                                </li>
                                <li class="nav-item nav-icon dropdown caption-content">
                                    <a href="#" class="search-toggle dropdown-toggle" id="dropdownMenuButton4"
                                        data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                                        <img src="{% static 'picture/18.jpg' %}" class="img-fluid rounded"
                                            alt="user"></a>
                                    <div class="iq-sub-dropdown dropdown-menu" aria-labelledby="dropdownMenuButton">
                                        <div class="card shadow-none m-0">
                                            <div class="card-body p-0 text-center">
                                                <div class="media-body profile-detail text-center">
                                                    <img src="{% static 'picture/profile-bg.jpg' %}" alt="profile-bg"
                                                        class="rounded-top img-fluid mb-4">
                                                    <img src="{% static 'picture/18.jpg' %}" alt="profile-img"
                                                        class="rounded profile-img img-fluid avatar-70">
                                                </div>
                                                <div class="p-3">
                                                    <p class="mb-0">{{ user_name }}</p>
                                                    <div class="d-flex align-items-center justify-content-center mt-3">
                                                        <a href="{% url 'nurse:profile' %}"
                                                            class="btn border mr-2">主页</a>
                                                        <a href="{% url 'nurse:logout' %}" class="btn border">登出</a>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </li>
                            </ul>
                        </div>
                    </div>
                </nav>
            </div>
        </div>
        <div class="modal fade" id="new-order" tabindex="-1" role="dialog" aria-hidden="true">
            <div class="modal-dialog modal-dialog-centered" role="document">
                <div class="modal-content">
                    <div class="modal-body">
                        <div class="popup text-left">
                            <h4 class="mb-3">New Order</h4>
                            <div class="content create-workform bg-body">
                                <div class="pb-3"><label class="mb-2">Email</label><input type="text"
                                        class="form-control" placeholder="Enter Name or Email">
                                </div>
                                <div class="col-lg-12 mt-4">
                                    <div class="d-flex flex-wrap align-items-ceter justify-content-center">
                                        <div class="btn btn-primary mr-4" data-dismiss="modal">Cancel</div>
                                        <div class="btn btn-outline-primary" data-dismiss="modal">Create</div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="content-page">
            {% block content %}
            <div class="container-fluid">
                <div class="row">
                    <div class="col-lg-4">
                        <div class="card card-transparent card-block card-stretch card-height border-none">
                            <div class="card-body p-0 mt-lg-2 mt-0">
                                <h3 class="mb-3">{{ user_name }}，<strong id="hello">您好！</strong></h3>
                                <p class="mb-0 mr-4">在此处展示和管理你所刷的题。</p>
                                <p class="mb-0 mr-4">{% now "Y年 m月d日 H:i" %}</p>
                            </div>
                        </div>
                    </div>
                    <div class="col-lg-8">
                        <div class="row">
                            <div class="col-lg-4 col-md-4">
                                <div class="card card-block card-stretch card-height">
                                    <div class="card-body">
                                        <div class="d-flex align-items-center mb-4 card-total-sale">
                                            <div class="icon iq-icon-box-2 bg-info-light">
                                                <img src="{% static 'picture/12.png' %}" class="img-fluid" alt="image">
                                            </div>
                                            <div>
                                                <p class="mb-2">刷题总数</p>
                                                <h4>{{ total_count }}</h4>
                                            </div>
                                        </div>
                                        <div class="iq-progress-bar mt-2">
                                            <span class="bg-info iq-progress progress-1" data-percent="100"></span>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="col-lg-4 col-md-4">
                                <div class="card card-block card-stretch card-height">
                                    <div class="card-body">
                                        <div class="d-flex align-items-center mb-4 card-total-sale">
                                            <div class="icon iq-icon-box-2 bg-danger-light">
                                                <img src="{% static 'picture/2.png' %}" class="img-fluid" alt="image">
                                            </div>
                                            <div>
                                                <p class="mb-2">题目总数</p>
                                                <h4>{{ exercise_count }}</h4>
                                            </div>
                                        </div>
                                        <div class="iq-progress-bar mt-2">
                                            <span class="bg-danger iq-progress progress-1" data-percent="100"></span>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="col-lg-4 col-md-4">
                                <div class="card card-block card-stretch card-height">
                                    <div class="card-body">
                                        <div class="d-flex align-items-center mb-4 card-total-sale">
                                            <div class="icon iq-icon-box-2 bg-success-light">
                                                <img src="{% static 'picture/3.png' %}" class="img-fluid" alt="image">
                                            </div>
                                            <div>
                                                <p class="mb-2">总正确率</p>
                                                <h4>{{ correct_rate|default:0 }}%</h4>
                                            </div>
                                        </div>
                                        <div class="iq-progress-bar mt-2">
                                            <span class="bg-success iq-progress progress-1" data-percent="100"></span>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="col-lg-8">
                        <div class="card card-block card-stretch card-height">
                            <div class="card-header d-flex align-items-center justify-content-between">
                                <div class="header-title">
                                    <h4 class="card-title">考试题库</h4>
                                </div>
                            </div>
                            <div class="card-body">
                                <ul class="list-unstyled row top-product mb-0">
                                    <li class="col-lg-3">
                                        <div class="card card-block card-stretch card-height mb-0">
                                            <div class="card-body">
                                                <div class="bg-warning-light rounded">
                                                    <img src="{% static 'picture/01.png' %}"
                                                        class="style-img img-fluid m-auto p-3" alt="image">
                                                </div>
                                                <div class="style-text text-left mt-3">
                                                    <h5 class="mb-1">基础护理学</h5>
                                                    <p class="mb-0">{{ category.0 }} 题</p>
                                                </div>
                                            </div>
                                        </div>
                                    </li>
                                    <li class="col-lg-3">
                                        <div class="card card-block card-stretch card-height mb-0">
                                            <div class="card-body">
                                                <div class="bg-danger-light rounded">
                                                    <img src="{% static 'picture/02.png' %}"
                                                        class="style-img img-fluid m-auto p-3" alt="image">
                                                </div>
                                                <div class="style-text text-left mt-3">
                                                    <h5 class="mb-1">内科护理学</h5>
                                                    <p class="mb-0">{{ category.1 }} 题</p>
                                                </div>
                                            </div>
                                        </div>
                                    </li>
                                    <li class="col-lg-3">
                                        <div class="card card-block card-stretch card-height mb-0">
                                            <div class="card-body">
                                                <div class="bg-info-light rounded">
                                                    <img src="{% static 'picture/03.png' %}"
                                                        class="style-img img-fluid m-auto p-3" alt="image">
                                                </div>
                                                <div class="style-text text-left mt-3">
                                                    <h5 class="mb-1">外科护理学</h5>
                                                    <p class="mb-0">{{ category.2 }} 题</p>
                                                </div>
                                            </div>
                                        </div>
                                    </li>
                                    <li class="col-lg-3">
                                        <div class="card card-block card-stretch card-height mb-0">
                                            <div class="card-body">
                                                <div class="bg-success-light rounded">
                                                    <img src="{% static 'picture/01.png' %}"
                                                        class="style-img img-fluid m-auto p-3" alt="image">
                                                </div>
                                                <div class="style-text text-left mt-3">
                                                    <h5 class="mb-1">妇产科护理学</h5>
                                                    <p class="mb-0">{{ category.3 }} 题</p>
                                                </div>
                                            </div>
                                        </div>
                                    </li>
                                    <li class="col-lg-3">
                                        <div class="card card-block card-stretch card-height mb-0">
                                            <div class="card-body">
                                                <div class="bg-success-light rounded">
                                                    <img src="{% static 'picture/02.png' %}"
                                                        class="style-img img-fluid m-auto p-3" alt="image">
                                                </div>
                                                <div class="style-text text-left mt-3">
                                                    <h5 class="mb-1">儿科护理学</h5>
                                                    <p class="mb-0">{{ category.4 }} 题</p>
                                                </div>
                                            </div>
                                        </div>
                                    </li>
                                    <li class="col-lg-3">
                                        <div class="card card-block card-stretch card-height mb-0">
                                            <div class="card-body">
                                                <div class="bg-success-light rounded">
                                                    <img src="{% static 'picture/01.png' %}"
                                                        class="style-img img-fluid m-auto p-3" alt="image">
                                                </div>
                                                <div class="style-text text-left mt-3">
                                                    <h5 class="mb-1">医学伦理学</h5>
                                                    <p class="mb-0">{{ category.5 }} 题</p>
                                                </div>
                                            </div>
                                        </div>
                                    </li>
                                </ul>
                            </div>
                        </div>
                    </div>
                    <div class="col-lg-4">
                        <div class="card-transparent card-block card-stretch mb-4">
                            <div class="card-header d-flex align-items-center justify-content-between p-0">
                                <div class="header-title">
                                    <h4 class="card-title mb-0">排行榜</h4>
                                </div>
                                <div class="card-header-toolbar d-flex align-items-center">
                                    <div><a href="#" class="btn btn-primary view-btn font-size-14">查看全部</a></div>
                                </div>
                            </div>
                        </div>
                        <div class="card card-block card-stretch card-height-helf">
                            <div class="card-body card-item-right">
                                <div class="d-flex align-items-top">
                                    <div class="bg-warning-light rounded">
                                        <img src="{% static 'picture/04.png' %}" class="style-img img-fluid m-auto"
                                            alt="image">
                                    </div>
                                    <div class="style-text text-left">
                                        <h5 class="mb-2">{{ two_nurse.0.name }}</h5>
                                        <p class="mb-2">共计: {{ two_nurse.0.total_count }}题</p>
                                        <p id="nurse1" class="mb-0"></p>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="card card-block card-stretch card-height-helf">
                            <div class="card-body card-item-right">
                                <div class="d-flex align-items-top">
                                    <div class="bg-danger-light rounded">
                                        <img src="{% static 'picture/05.png' %}" class="style-img img-fluid m-auto"
                                            alt="image">
                                    </div>
                                    <div class="style-text text-left">
                                        <h5 class="mb-2">{{ two_nurse.1.name }}</h5>
                                        <p class="mb-2">共计: {{ two_nurse.1.total_count }}题</p>
                                        <p id="nurse2" class="mb-0"></p>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    {% endblock %}
    <footer class="iq-footer">
        <div class="container-fluid">
            <div class="card">
                <div class="card-body">
                    <div class="row">
                        <div class="col-lg-6">
                            <ul class="list-inline mb-0">
                                <li class="list-inline-item"><a href="#">开发者</a></li>
                                <li class="list-inline-item"><a href="#">往期作品</a></li>
                            </ul>
                        </div>
                        <div class="col-lg-6 text-right"><span class="mr-1">
                                <script>document.write(new Date().getFullYear())</script>©
                            </span>By
                            <a href="#">王欣</a>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </footer>
    <script src="{% static 'js/backend-bundle.min.js' %}"></script>
    <script src="{% static 'js/table-treeview.js' %}"></script>
    <script src="{% static 'js/customizer.js' %}"></script>
    <script async="" src="{% static 'js/chart-custom.js' %}"></script>
    <script src="{% static 'js/app.js' %}"></script>
    <script src="{% static 'js/jquery-3.7.0.js' %}"></script>
    <script src="{% static 'js/jquery.validate.min.js' %}"></script>

    <script>
        // 设置问候语
        let p = document.getElementById('hello');
        let date = new Date();
        let hour = date.getHours();
        if (hour < 12) {
            p.innerText = '早上好！'
        } else if (hour < 18) {
            p.innerText = '下午好！'
        } else {
            p.innerText = '晚上好！'
        }
        // 设置正确率
        let n1 = {{ two_nurse.0.correct_count }} / {{ two_nurse.0.total_count }};
        let n2 = {{ two_nurse.1.correct_count }} / {{ two_nurse.1.total_count }};
        $('#nurse1').text('正确率：' + n1 + '%');
        $('#nurse2').text('正确率：' + n2 + '%');


    </script>

    {% block js_code %}

    {% endblock %}
</body>

</html>